﻿{include file="common/header1" /}
<div class="collect_page w1440">
    <p class="title">Your bag</p>
    <ul>
        <li class="first">
            <div>PRODUCE</div>
            <div>EDIT</div>
            <div>TOTALS</div>
        </li>
    </ul>
</div>
<div class="cartBox">
    <link rel="stylesheet" href="/public/home/xin/css/carts.css">
    <div class="order_content clearfix w1200">
        {foreach name="cart" item="val"}
        <ul class="order_lists">
            <li class="list_chk ">
                {if $val.is_del == 0}
                <input type="checkbox" id="checkbox_{$val.id}" class="son_check xz goods-list-item" data="0" data-id="{$val.id}" data-name="{$val.goods_name}">
                <label for="checkbox_{$val.id}"></label>
                {/if}
            </li>
            <li class="imgbox">
                <div>
                    <span><img src="{$val.goods_logo}"></span>
                    <div>
                        <p class="p1">{$val.goods_name}</p>
                        <p class="p2">Accessory:One Size</p>
                        <p class="p3">
                            Colour:<span style="background: #d2bb9b;" class="colour"></span>
                        </p>
                    </div>
                </div>
            </li>
            <li class="list_price" style="display: none;">
                <p class="price single-price pri">{$val.goods_price}</p>
            </li>
            <li class="list_amount">
                <div class="amount_box">
                    <a href="javascript:;" class="reduce reSty shop_bk-jian" data-price="{$val.goods_price}">-</a>
                    <input type="text" value="{$val.goods_number}" data-id="{$val.id}" data-max="{$val.max_number}" data-goods="{$val.goods_id}" class="sum goods-count shop_bk-zi">
                    <a href="javascript:;" class="plus shop_bk-jia" data-price="{$val.goods_price}">+</a>
                </div>
                <div class="list_op">
                    <p class="del">
                        <a href="javascript:;" class="delBtn" href="javascript:;" data-id="{$val.id}"><img src="/public/home/xin/images/shopping_card_03.jpg" alt="">Remove</a>
                    </p>
                </div>
            </li>
            <li class="list_sum">
                <p class="sum_price">$<span
                        class="single-total xzj">{$val.goods_price * $val.goods_number}</span></p>
            </li>
        </ul>
        {/foreach}

    </div>

    <div class="w1200 clearfix">
        <div class="bar-right">
            <!-- <div class="piece">已选商品<strong class="piece_num">0</strong>件</div> -->
            <div class="totalMoney">Title:<strong class="total_text zj" id="selectGoodsMoney">0.00</strong></div>
            <div class="calBtn">
                <form action="{:url('Flow/checkout')}" id="checkout" method="post" class="col-md-1 bottom-menu submitData submitDis">
                    <input type="hidden" id="cart_ids" name="cart_ids">
                    <input type="hidden" id="amount" name="amount">
                    <a href="javascript:;" class="col-md-1 bottom-menu submitData submitDis" id="create_order_pay">PROCEED TO CHECKOUT</a>
                </form>

            </div>
        </div>
    </div>
</div>
<section class="my_model">
    <p class="title">删除宝贝<span class="closeModel">X</span></p>
    <p>您确认要删除该宝贝吗？</p>
    <div class="opBtn">
        <a href="javascript:;" class="dialog-sure">确定</a><a href="javascript:;" class="dialog-close">关闭</a>
    </div>
</section>

<script type="text/javascript">
    $(".goods-list-item").on("click", function(){
        if ($(this).prop("checked")) {
            $(this).attr("data",1)
            //检查所有复选是否已全选中
            var all_num = parseInt($('.goods-list-item').length); //记录总数
            var checked_num = parseInt($('.goods-list-item:checked').length); //选中的数量
            //记录总数与选中数量相等时全选按钮选中，否则全选按钮取消选中
            if(all_num==checked_num){
                $('#qx').attr('checked',true);
                $('#qx').prop('checked',true);
                $('#qx').attr('data',1);
            }else{
                $('#qx').attr('checked',false);
                $('#qx').prop('checked',false);
                $('#qx').attr('data',0);
            }

        }else{
            //如果被取消，则取消全选按钮
            $(this).attr("data",0);
            $("#qx").attr("checked", false);
            $("#qx").prop("checked", false);
            $("#qx").attr("data", 0);
        }

        js();

    })
    $("#qx").on("click", function(){
        if ($(this).prop("checked")) {
            //如果已选中，全选
            $('.goods-list-item').attr("checked", true);
            $('.goods-list-item').prop("checked", true);
            $(".goods-list-item").attr("data",1);
            $(this).attr("data",1);
        } else {
            //如果已取消，全部取消
            $('.goods-list-item').attr("checked", false);
            $('.goods-list-item').prop("checked", false);
            $(".goods-list-item").attr("data",0);
            $(this).attr("data",0);
        }
        js();
    })

    $(".shop_bk-jian").click(function () {
        var price = $(this).attr("data-price");
        var a = $(this).next().val();
        if(a == 1){
            return false;
        }
        a--;
        $(this).siblings(".shop_bk-zi").val(a);

        var goods_price = parseFloat(price) * parseInt(a);
        $(this).parent().parent().next().find(".xzj").html(goods_price);
        js();

        var url = "{:url('Flow/set_num')}"; //后台AJAX修改购物车商品数量
        var number = $(this).next().val();
        var cart_id = $(this).next().data("id");
        var goods_id = $(this).next().data("goods");

        $.ajax({
            type:'post',
            url:url,
            data:{cart_id:cart_id,goods_id:goods_id,num:number},
            dataType:'json',
            success:function(data){ //请求成功回调函数
                var error_code = data.error_code; //获取返回值
                var msg = data.error_smg;
                if(error_code == 0){ //判断状态码，0为成功

                }else if(error_code == 2){
                    $(this).prev().data("max",0);
                    $(this).prev().val(0);
                }else{

                }

            },
        });

    });


    $(".shop_bk-jia").click(function () {
        var price = $(this).attr("data-price");
        var a = $(this).prev().val();

        a++;
        $(this).siblings(".shop_bk-zi").val(a);

        var url = "{:url('Flow/set_num')}"; //后台AJAX修改购物车商品数量
        var max = $(this).prev().data("max");
        var number = $(this).prev().val();
        var cart_id = $(this).prev().data("id");
        var goods_id = $(this).prev().data("goods");

        if(number > max){
            $(this).prev().val(max);
            return false;
        }else{
            var goods_price = parseFloat(price) * parseInt(a);
            $(this).parent().parent().next().find(".xzj").html(goods_price);
            js();
        }

        $.ajax({
            type:'post',
            url:url,
            data:{cart_id:cart_id,goods_id:goods_id,num:number},
            dataType:'json',
            success:function(data){ //请求成功回调函数
                var error_code = data.error_code; //获取返回值
                var msg = data.error_smg;
                if(error_code == 0){ //判断状态码，0为成功

                }else if(error_code == 2){
                    $(this).prev().data("max",0);
                    $(this).prev().val(0);
                }else{

                }

            },
        });

    })

    $(".shop_del").click(function(){
        if(confirm("是否删除该商品?")) {
            var url = "{:url('Flow/del')}"; //后台AJAX删除购物车商品
            var id = $(this).data("id");
            $.ajax({
                type: 'post',
                url: url,
                data: {id: id},
                dataType: 'json',
                success: function (data) { //请求成功回调函数
                    if (data.code == 0) {
                        //弹窗提示
                        layer.msg(data.info, {icon: 6});
                    } else {
                        layer.msg(data.info, {icon: 5});
                    }

                },
            });

            $(this).parent().parent().parent().parent().remove();
            js();
        }
    })

    function js() {

        var num = 0;
        var conut = 0;
        var dxj = 0;
        $(".xz").each(function () {
            if ($(this).attr("data") == 1) {
                var b = $(this).parent().parent().find(".list_amount").find(".amount_box").find(".shop_bk-zi").val();
                var jg = $(this).parent().parent().find(".list_price").find(".pri").text();
                var dj = b * jg;
                conut += parseInt(b);
                num += b * jg;
                dxj = dj.toFixed(2);
                // $(this).parent().next().next().next().next().find(".xzj").text(dxj);
            }
        })
        $('.zj').html(num.toFixed(2));
        $('#selectGoodsCount').html(conut);
    }

    //提交结算
    $("#create_order_pay").click(function(){
        //结算前检测是否有选择商品
        var selected = 0;
        var cart_ids = 0;

        $('.xz').each(function () {
            if($(this).attr("data") ==  1){
                selected = 1;

                var selected_id = $(this).data("id")
                if(cart_ids == 0){
                    cart_ids = selected_id
                }else{
                    cart_ids = cart_ids+","+selected_id
                }
            }
        });
        if(selected == 0){
            alert("您未选择要结算的商品");
            return false;
        }

        var amount = $('#selectGoodsMoney').html()
        $("input[name='cart_ids']").val(cart_ids);
        $("input[name='amount']").val(amount);
        $('#checkout').submit();


        //为订单信息传入参数
        // var order_info = $("#order_info").val();
        // $("#order_goods").html(order_info);
        // if($("#order_goods").html().length>20){
        //     $("#order_goods").html($("#order_goods").html().substring(0,20));
        //     $("#order_goods").html($("#order_goods").html()+'...');
        // }
    })
</script>

{include file="common/footer" /}